Component({
  data: {
    canvasTemplate: null,
  },
  properties: {
    bgImgUrl: String,
  },
  lifetimes: {
    ready() {
      this.genPosterData()
    }
  },
  methods: {
    posterImgOk(e) {
      this.triggerEvent('poster', e.detail.path);
      this.setData({canvasTemplate: null})
    },
    genPosterData() {
      let defaultWidth = 750;
      let defaultHeight = 600;
      let bgImgUrl = getApp().toFullUrl(this.data.bgImgUrl);
      let bg = getApp().toFullUrl("/wxapp/static/posterAndShare/ordering-poster-bg.png");
      this.setData({canvasTemplate: null})
      let canvasTemplate = {
        background: bg,
        width: defaultWidth + "rpx",
        height: defaultHeight + "rpx",
        views: [
          {
            type: "image",
            url: bgImgUrl,
            css: {
              top: "203rpx",
              left: (defaultWidth - 383) / 2 + 5 + "rpx",
              width: "383rpx",
              height: "255rpx",
              mode: "aspectFill",
              borderRadius: "17rpx"
            }
          }
        ]
      };
      wx.nextTick(() => {
        this.setData({canvasTemplate: canvasTemplate})
      })
    },
  }
});
